

/* dimmed overlay */
.dt.dimoverlay {
    opacity: 0;
    pointer-events: none;
    position: fixed;
    z-index: 100000;
    width: 100%;
    height: 100%;
    top: 0px;
    right: 0px;
    content: '';
    background-color: rgba(0, 0, 0, 0.4);
    overflow: hidden;
    -moz-transition: opacity 150ms;
    -ms-transition: opacity 150ms;
    -o-transition: opacity 150ms;;
    -webkit-transition: opacity 150ms;
    transition: opacity 150ms;
}
.dt.dimoverlay.dtopen {
    opacity: 1;
    pointer-events: auto;
}

/* slide drawer bottom */
.dt.drawer.bottom
{
    pointer-events: none;
    height: auto;
    max-height: 0%;
    position: fixed;
    z-index: 100001;
    bottom: 0;
    left: 0;
    right: 0;
    overflow-y: scroll;
    box-shadow: rgba(34, 36, 38, 0.15) 1px 0px 0px;
    background-color: rgb(250, 250, 250);
    -moz-transition: max-height 150ms;
    -ms-transition: max-height 150ms;
    -o-transition: max-height 150ms;;
    -webkit-transition: max-height 150ms;
    transition: max-height 150ms;
}

.dt.drawer.bottom.dtopen {
    max-height: 60%;
    pointer-events: auto;
}

body.nightmode .dt.drawer.bottom {
    background: rgb(17, 17, 17);
    color: rgb(240, 240, 240);
}

body.nightmode .dt.drawer.bottom .item {
    color: rgb(240, 240, 240) !important;
}



.dt.drawer.bottom .item
{
  text-align: center;
  padding: 10px;
}

.dt.drawer.bottom .item:hover
{
  text-align: center;
  padding: 10px;
}



#mobileselector.nightmode .ui.labeled.icon.menu .item
{
    color: #FFF !important;
}
